
import Event from '../../event/index'
import sprite from './sprite'
import { isClickOnSprite } from '../../utils/index'
import { screenWidth, screenHeight } from '../../constant/index'
/**
 * 事件列表
 */
const EVENT_TYPE = ['touchend', 'touchstart', 'touchmove']
const LIFE_CYCLE = ['onLoad', 'onShow', 'onHide', 'onUnload', 'destroy']
export default class Page extends sprite {
  ctx = null
  constructor(ctx = null) {
    super(ctx)
    this.ctx = ctx
    EVENT_TYPE.forEach(type => {
      Event.offOnly(type, this.id)
      Event.only(type, this.id, (...ages) => {
        if (!this.visible) {
          return
        }
        this._executeEvent(this._eventCaptur(ages[0]), type, ...ages)
      })
    })
    this.visible = false
    this.width = screenWidth
    this.height = screenHeight
    this._lifeCycle = new Map()
    LIFE_CYCLE.forEach(type => {
      this[`_execute_${type}`] = function (...ages) {
        const list = this._lifeCycle.get(type) || []
        list.forEach(fn => fn(...ages))
        this._listenCustomEvent(type, ...ages)
      }
      this[`$${type}`] = function (fn) {
        const list = this._lifeCycle.get(type) || [fn]
        this._lifeCycle.set(type, list)
      }
    })
  }
}